<template>
  <div class="popup_page">
    <div class="title">关联广告批量关闭</div>
    <el-form :model="state.form" label-width="130px" class="mt_20">
      <el-form-item label="页数(尾页)：">
        <el-input-number
          v-model="state.form.pagesize"
          :min="1"
          style="width: 180px"
        />
      </el-form-item>
      <el-form-item label="条件：">
        <el-select
          v-model="state.form.pagesize"
          placeholder="选择日期"
          style="width: 180px"
        >
          <el-option label="今天" :value="1" />
          <el-option label="昨天" :value="2" />
          <el-option label="最近七天" :value="3" />
          <el-option label="最近30天" :value="4" />
        </el-select>
      </el-form-item>
    </el-form>
    <div class="buttondiv">
      <el-button type="primary" @click="geturlData">开始关闭</el-button>
    </div>
  </div>
</template>

<script setup>
import { reactive } from "vue";
const chrome = window.chrome;
const state = reactive({
  form: {
    pagesize: 1,
    time: 1,
  },
});

// 获取数据
const geturlData = () => {
  let keyword = state.form.keyword;
  let quantity = parseFloat(state.form.quantity);
  let offer = state.form.offer;
  if (keyword != "") {
    let result = keyword.split("、");
    let a = {
      keyword: result,
      quantity: quantity,
      offer: offer,
    };
    // getbackground("resRobotKeyword", a);
    chrome.tabs.query({ currentWindow: true, active: true }, (tabs) => {
      //console.log(tabs);
      chrome.tabs.sendMessage(tabs[0].id, {
        data: a,
        action: "resRobotKeyword",
      });
    });
  }
};
</script>

<style lang="scss" scoped>
.mt_20 {
  margin-top: 20px;
}

.popup_page {
  width: 350px;
  height: 100%;
}

.title {
  text-align: center;
  font-size: 16px;
  font-weight: 600;
}

.cell {
  display: flex;
}
.buttondiv {
  display: flex;
  justify-content: center;
  padding: 15px 0;
}
.popup_list {
  display: flex;
  flex-direction: column;
  align-items: center;
}
</style>

<style>
.googlebutton .el-form-item__content {
  margin-left: 0 !important;
  display: flex;
  justify-content: center;
}

.el-input-group__append {
  padding: 0 12px;
}

.popup_dialog .el-dialog__footer {
  display: flex;
  justify-content: center;
}
.popup_jsontable .el-table__body-wrapper {
  font-size: 12px;
}

.el-loading-spinner {
  position: fixed;
  top: 200px;
}
</style>